// 全局混入可复用组件选项
// vue2中组件script部分默认导出的对象中的属性叫选项式API：data methods 生命周期函数等
// vue3中叫做 composition API (组合式API)
// 说明：混入对象可以包含任意组件选项

import store from '@/store'

export default {
  data () {
    return {
      hiMixin: 'mixin'
    }
  },
  // created () {
  //   console.log('全局混入生命周期函数')
  // }
  methods: {
    /**
     * 需求：控制页面下按钮权限
     * 步骤：
     * 1. 获取当前登录人的按钮权限（code身份标识）=》vuex中存储points
     * 2. 根据points数组中是否存在某个code身份标识=》决定按钮是否可见
     */
    // point 按钮身份标识
    canClick (point) {
      const { userInfo } = store.state.user
      // 核心：point在不在当前登录人的身份标识points数组中=》在=》返回true
      // return userInfo.roles.points.includes(point)

      // 退出登录报错：// vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in render: "TypeError: Cannot read properties of undefined (reading 'points')"
      // ?操作符使用场景：用来处理对象读取层级比较深（大于1层）的异常情况
      // 解决：在上一层数据属性名后加个?
      return userInfo.roles?.points.includes(point)
    },
    log (txt, bgc) {
      console.log(`%c ${txt}`, `width:100px;height:30px;padding:5px;border-radius:5px;background:${bgc || '#8df'};color:#fff`)
    }
  }
}
